<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>常用指令v-for</title>
</head>
<body>
    <div id="app">
    <ul>
        <!-- item指的是被遍历的数组对象的每一个值，item的命名不是规定的，可以自定义命名 -->
        <!-- index指的是每一项被遍历的值的下标索引值 -->
        <!-- key是用来给每一项值加元素标识，作用是为了区分元素，为了实现最小量的更新 -->
        <li v-for="(item,index) in arr"  :key="index">{{index}}--{{item}}</li>
    </ul>
    </div>
    <script src="js/vue2.js"></script>
    <script>
        new Vue({
    el:'#app',
    data:{
        arr:['苹果','橘子','香蕉','草莓']
    }
});
    </script>
</body>
</html>